import { loginAPI } from '@/api/user'
import { getToken, setToken, removeToken } from '@/utils/auth'
import { getProfileAPI } from '@/api/user'
import { routes } from '@/router'

export default {
  namespaced: true,
  state: {
    token: getToken() || '',
    permissions: [],
    menuList: [], // 保存用户可见的菜单列表
    hasAddedRoutes: false // 新增：标记动态路由是否已添加
  },
  mutations: {
    // 新增：更新路由添加状态
    setHasAddedRoutes (state, flag) {
      state.hasAddedRoutes = flag
    },
    updateToken (state, newVal) {
      state.token = newVal
      setToken(newVal)
    },
    removeToken (state) {
      // 清除vuex和存储在cookie的token
      // 知识点：页面自然刷新是不会清除vuex的值的
      state.token = ''
      removeToken()
    },
    updatePermissions (state, newVal) {
      state.permissions = newVal
    },
    // 保存用户可见的菜单列表
    // 知识点：权限控制，把静态、动态路由合并起来，让页面可以展示(比如【工作台】菜单，每个用户都可以看到，不合并的话就只能展示动态路由菜单了)
    updateMenuList (state, newVal) {
      state.menuList = [...routes, ...newVal]
    }
  },
  actions: {
    async login (store, data) {
      const res = await loginAPI(data)
      store.commit('updateToken', res.data.token)
    },
    async getPermissions (store) {
      const { data } = await getProfileAPI()
      store.commit('updatePermissions', data.permissions)
      // 知识点：在actions方法返回值，确保每次获取到的权限都是最新的
      return data.permissions
    }
  }
}
